import { createApp} from 'vue'
import './style.css'
import 'element-plus/dist/index.css'
import ElementPlus from 'element-plus'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import {VueDraggable} from 'vue-draggable-plus'
// import { renderToString } from 'vue/server-renderer';
import App from './App.vue'
import {useStore} from './store'
import * as Vue from 'vue'
import HrUI from 'gzhr-ui'
import 'gzhr-ui/dist/es/index.css'
// import { loadModule } from 'vue3-sfc-loader'

(window as any).Vue = Vue;
// (window as any).loadModule = loadModule;
useStore()
const app = createApp(App);
app.use(ElementPlus)
app.use(HrUI)
app.component('VueDraggable', VueDraggable)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
}
// 首屏渲染
// renderToString(app).then(html=>{
//     (window as any).html = html;
// })


app.mount('#app')
const log = console.log;
function getRandomColor() {
    const getRandomValue = () => Math.floor(Math.random() * 256);
    return `rgb(${getRandomValue()}, ${getRandomValue()}, ${getRandomValue()})`;
}
(console as any).logs = function (...args:any) {
    if (typeof args[0] === 'string') {
        const coloredChars = Array.from(args[0]).map(char => `%c${char}`).join('');
        const styles = Array.from(args[0]).map(() => `color: ${getRandomColor()};`);
        args[0] = coloredChars;
        args.splice(1, 0, ...styles);
        log(...args);
    }
};